#include ("/_includes/_layout.html")
#@layout("好友助力","wxmall,点步科技","Wxmall社区","wxmall") 
<style>
.award-bg{
	height: 100%;
	position: relative;
	background: #fdfdfd;
}
.award-box{
	display:block;
	position: absolute;
	top: 0;
	bottom:0;
	left:0;
	right:0;
	margin: 20% 2%;
}
.award{
	width: 100%; 
	height: 100%;
}
.weui-content{
	min-height: 100%
}
.award-box .item-name{
	color: #999;
}
.award-box span{
	color: #000;
}
.award-item{
	border: 1px solid #e7eaec;
    background: white;
	padding: 0px 2%;
}
.award-box li{
	line-height: 30px;
	border-bottom: 1px dashed #e7eaec;
	margin-top: 10px;
}
.award-box li li{
	border-bottom: none;
	line-height:25px;
	margin-top: 10px;
}
.award-status{
    border: 1px solid;
    padding: 0px 5px;
    border-radius: 5px;
    font-size: 12px;
    position: relative;
    float:right;
    bottom: 14px;
}
.award-box li li .award-status-rcd{
    border: 1px solid;
    padding: 0px 5px;
    border-radius: 5px;
    font-size: 12px;
    position: relative;
    float:right;
    bottom: 14px;
    color: #eb0000;
}
.footer-list-box{
	background-color:#fdfdfd;	
	text-align: left;
	padding:10px 0px 10px 20px;
	margin: 10px 0px;
	border-top: 1px solid #ededed;
	border-bottom: 1px solid #ededed;
}
.footer-box{
	text-align: center;
    position: absolute;
    left: 0;
    right: 0;
    margin: 50% 0px;
    color: #999;
}
.weui-loadmore{
	position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
}
#detail_list{
	position: relative;
}
</style>
#define content()
<div class="weui-tab">
	<div class="weui-navbar " style="position:fixed;  left:0; right:0; height:44px; background:#fff;">
	    <a href="#(webctx)/task/detail?taskid=#(taskid??)" class="weui-navbar__item proinfo-tab-tit font-14 weui-bar__item--on">好友助力</a>
   	    <a href="#(webctx)/task/award?taskid=#(taskid??)" class="weui-navbar__item proinfo-tab-tit font-14">领奖记录</a>
   	    <a href="#(webctx)/task/detail/orders?taskid=#(taskid??)" class="weui-navbar__item proinfo-tab-tit font-14">排行榜</a>
    </div>
	<div class="weui-tab__bd">
	<div class="weui-tab__bd-item weui-tab__bd-item--active" id="detail_list"></div>
	<div class="weui-loadmore">
	    <i class="weui-loading"></i>
	    <span class="weui-loadmore_tips">正在加载</span>
	</div>
	</div>
</div>
#end
#define script()
<script type="text/html" id="user_tpl">
<div class="footer-list-box">
	<div style="width:45px; height:45px; margin-right: 10px; float: left;"><img style="width:100%; height:100%" src="{headimgurl}"/></div>
	<div style="color: black;font-size: 16px;"> {nickname} {stauts}</div>
	<div>{updated}</div>
</div>
</script>
<script type="text/html" id="user_none_tpl">
	<div style="padding-top: 50px;text-align: center;font-size: 14px;">没有数据</div>
</script>
<script type="text/javascript">
var page = 1;
var params = {};
params.page = page;
var loading = false;  //状态标记
//滚动加载
$(document.body).infinite().on("infinite",function(){
	if(loading) return;
	loading = true;
	page ++;
	params.page = page;
	submit(params);
});
function submit(arr){
	$.ajax({
		type: "post",
		url: "#(webctx)/task/detail/userList?taskid=#(taskid??)",
		data: arr,
		async: true,
		success: function(data){
			if(data.code != 200){
				$.toast("加载数据失败，请重新拉取");
				return;
			}else if(data.data == null){
				$(document.body).destroyInfinite();
				$('.weui-loadmore').remove();
				$("#detail_list").append($("#user_none_tpl").html());
				return;
			}
			if(data.data.length<=0){
				$(document.body).destroyInfinite();
				$('.weui-loadmore').remove();
				$("#detail_list").append($("#user_none_tpl").html());
			}else{
				 for( var i = 0 ; i < data.data.length ; i ++ ){
					var userData = data.data[i];
					if(userData.active){
						userData.stauts = "已关注";
					}else{
						userData.stauts = "已取关";
					}
					var html = formatTemplate(userData, $("#user_tpl").html());
					$("#detail_list").append(html);
					loading = false;
				}	
				 if(data.data.length<10){
						$(document.body).destroyInfinite();
		                $('.weui-loadmore').remove();
				}
			}
		},
		error: function(){
			alert("网络异常,请联系管理员!");
		}
	});
}

submit(params);
</script>
#end